/**
 * 博客demo页样式
 * @author dailc
 */

.demo-container {
	position: relative;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px
}
a,a:focus,a:hover {
    text-decoration: none;
    transition: 0.5s ease;
}

/*
 * demo grid布局
 */

 .grid .grid-item {
 	/*
 	 * 因为高度是与宽度相关的，所以手动设置item宽度，避免计算误差
 	 */
 	width: 240px;
	margin-bottom: 20px;
	padding-bottom: 10px;
	border: 1px solid rgba(0, 0, 0, 0.3);
	background-color: #fff;
	transition: 0.5s ease;
	-webkit-transition: 0.5s ease;
	-moz-transition: 0.5s ease;
	-webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
}
.grid .grid-item img {
	width: 100%;
}
.grid .grid-item:hover {
	transition: 0.5s ease;
	-webkit-transition: 0.5s ease;
	-moz-transition: 0.5s ease;
	
	-webkit-box-shadow: 0px 2px 30px 0px rgba(0, 0, 0, 0.67);
	-moz-box-shadow: 0px 2px 30px 0px rgba(0, 0, 0, 0.67);
	box-shadow: 0px 2px 30px 0px rgba(0, 0, 0, 0.67);
}
/*
 * item里的内容样式
 */
.grid .grid-item h3,
.grid .grid-item p {
	margin: 0;
    padding: 0 8px;
}
.grid .grid-item h3 {
	margin:  10px 0;
	font-size: 18px;
}
.grid .grid-item p {
	margin-top: 5px;
	font-size: 14px;
}
.grid .grid-item .icon-code:before {
	content: '</>';
}
@media only screen and (min-width: 768px) {
	.container {
    	width: 90%;
	}
}
@media only screen and (max-width: 768px) {
	.container {
    	width: 100%;
	}
}